<style lang="less">
@import "./commonComp.less";
</style>
<template>
    <div>
        <Row class="margin-top-10 searchable-table-con1">
            <Table :loading="loading" border :columns="columns" :data="data" sortable="custom" @on-sort-change="changeSort" @on-selection-change="showSelect" ref="table"></Table>
            <Table :columns="columns" :data="exportData" ref="exportTable" style="display:none"></Table>
        </Row>
        <Row type="flex" justify="end" class="code-row-bg page">
            <Page :current="this.searchForm.pageNumber" :total="total" :page-size="this.searchForm.pageSize" @on-change="changePage" @on-page-size-change="changePageSize" :page-size-opts="[10,20,50,100]" size="small" show-total show-elevator show-sizer></Page>
        </Row>
    </div>
</template>

<script>

export default {
  name: "goods-view-comp",
  props:{
    supplierId: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      loading: false,
      drop: false,
      selectCount: 0,
      selectList: [],
      searchForm: {
        supplierId: "",
        pageNumber: 1,
        pageSize: 10,
        sort: "createTime",
        order: "desc"
      },
      modalType: 0,
      lineModalVisible: false,
      modalTitle: "",
      lineForm: {
        sex: 1,
        type: 0
      },
      userRoles: [],
      roleList: [],
      errorPass: "",
      lineFormValidate: {
      },
      submitLoading: false,
      columns: [
        {
          type: "selection",
          width: 60,
          align: "center"
        },
        {
          title: "名字",
          key: "itemName",
          width: 150,
          sortable: true
        },
        {
          title: "供应商",
          key: "supplier",
          width: 120,
          sortable: true,
          align: "center",
          render: (h, params) => {
            let re = "";
            if(params.row.supplier != null){
              re = params.row.supplier.supplierName;
            }
            return h("span", re);
          }
        },
        {
          title: "价格",
          key: "itemPrice",
          width: 150,
          sortable: true
        },
        {
          title: "审核状态",
          key: "status",
          align: "center",
          width: 150,
          render: (h, params) => {
            let re = "";
            if (params.row.status === 0) {
              return h("div", [
                h(
                  "Tag",
                  {
                    props: {
                      type: "dot",
                      color: "red"
                    }
                  },
                  "未审核"
                )
              ]);
            } else if (params.row.status === -1) {
              return h("div", [
                h(
                  "Tag",
                  {
                    props: {
                      type: "dot",
                      color: "red"
                    }
                  },
                  "未通过"
                )
              ]);
            } else if (params.row.status === 1) {
              return h("div", [
                h(
                  "Tag",
                  {
                    props: {
                      type: "dot",
                      color: "green"
                    }
                  },
                  "通过"
                )
              ]);
            }
          },
          filters: [
            {
              label: "未审核",
              value: 0
            },
            {
              label: "未通过",
              value: -1
            },
            {
              label: "通过",
              value: 1
            }
          ],
          filterMultiple: false,
          filterMethod(value, row) {
            if (value === 0) {
              return row.status === 0;
            } else if (value === -1) {
              return row.status === -1;
            } else if (value === 1) {
              return row.status === 1;
            }
          }
        },
        {
          title: "是否预定",
          key: "status",
          align: "center",
          width: 150,
          render: (h, params) => {
            let re = "";
            if (params.row.status === 0) {
              return h("div", [
                h(
                  "Tag",
                  {
                    props: {
                      type: "dot",
                      color: "green"
                    }
                  },
                  "正常启用"
                )
              ]);
            } else if (params.row.status === -1) {
              return h("div", [
                h(
                  "Tag",
                  {
                    props: {
                      type: "dot",
                      color: "red"
                    }
                  },
                  "禁用"
                )
              ]);
            }
          },
          filters: [
            {
              label: "正常启用",
              value: 0
            },
            {
              label: "禁用",
              value: -1
            }
          ],
          filterMultiple: false,
          filterMethod(value, row) {
            if (value === 0) {
              return row.status === 0;
            } else if (value === -1) {
              return row.status === -1;
            }
          }
        },
        {
          title: "是否分销",
          key: "isDistribut",
          align: "center",
          width: 120,
          render: (h, params) => {
            let re = "";
            if (params.row.isDistribut === 0) {
              return h("div", [
                h(
                  "Tag",
                  {
                    props: {
                      type: "dot",
                      color: "red"
                    }
                  },
                  "关闭"
                )
              ]);
            } else if (params.row.isDistribut === 1) {
              return h("div", [
                h(
                  "Tag",
                  {
                    props: {
                      type: "dot",
                      color: "green"
                    }
                  },
                  "开启"
                )
              ]);
            }
          },
          filters: [
            {
              label: "关闭",
              value: 0
            },
            {
              label: "开启",
              value: 1
            }
          ],
          filterMultiple: false,
          filterMethod(value, row) {
            if (value === 0) {
              return row.isDistribut === 0;
            } else if (value === 1) {
              return row.isDistribut === 1;
            }
          }
        },
        {
          title: "分销比例",
          key: "billRow",
          sortable: true,
          width: 120,
          render: (h, params) => {
            if (params.row) {
              return h("span",
                params.row.billRow * 100
              );
            }
          }
        },
        {
          title: "操作",
          key: "action",
          width: 140,
          align: "left",
          render: (h, params) => {
              return h("div", [
                h(
                  "Button",
                  {
                    props: {
                      type: "success",
                      size: "small"
                    },
                    style: {
                      marginRight: "5px"
                    },
                    on: {
                      click: () => {
                        this.viewDisSupplier(params.row);
                      }
                    }
                  },
                  "查看分销商"
                ),
              ]);
          }
        }
      ],
      data: [],
      exportData: [],
      total: 0

      ,
      lineReviewModalVisible: false,
      lineReviewForm: {
        reviewLineId: "",
        reviewStatus: "0",
        nopassReason: "",
        nopassReasonVisible: false
      },
      lineReviewFormValidate: {
      },

    };
  },
  methods: {
    transSupplierId(supplierId){
      this.searchForm.supplierId = supplierId;
      this.getList();
    },


    init() {
      console.log("==============");
      console.log(this.supplierId);
      this.getList();
      this.cleanSelectCount();
    },
    initData(value){
      console.log("===========value========");
      console.log(value);
      this.getList();
    },
    changePage(v) {
      this.searchForm.pageNumber = v;
      this.getList();
    },
    changePageSize(v) {
      this.searchForm.pageSize = v;
      this.getList();
    },

    getList() {
      this.loading = true;
      (this.searchForm.supplierId==null) && delete this.searchForm.supplierId;
      this.getRequest("/goods_item/list", this.searchForm).then(res => {
        this.loading = false;
        if (res.success === true) {
          this.data = res.result.content;
          this.total = res.result.totalElements;
        }
      });
    },

    changeSort(e) {
      this.searchForm.sort = e.key;
      this.searchForm.order = e.order;
      if (e.order === "normal") {
        this.searchForm.order = "";
      }
      this.init();
    },

    lineRevewStatusChange(value) {
      (value === "-1") ? (this.lineReviewForm.nopassReasonVisible = true) : (this.lineReviewForm.nopassReasonVisible = false);
    },
    cancelLineReview() {
      this.lineReviewModalVisible = false;
    },
    submitLineReview() {
      let url = "";
      url = "/line/review";
    },

    viewDisSupplier(v) {
      if(v.id){
        let returnDisObj = {
          flag: true,
          type: "GOODS",
          viewObj: v
        }
        this.$emit('on-view-success',returnDisObj);
      }
    },

    closeDistribute(v) {
      if(v.id){
        let returnDisObj = {
          flag: true,
          type: "GOODS",
          disObj: v
        }
        this.$emit('on-close-success',returnDisObj);
      }
    },

    disPercentSet(v){
      if(v.id){
        let returnDisObj = {
          flag: true,
          type: "GOODS",
          disObj: v
        }
        this.$emit('on-percentset-success',returnDisObj);
      }
    },

    showSelect(e) {
      this.exportData = e;
      this.selectList = e;
      this.selectCount = e.length;
    },
    clearSelectAll() {
      this.$refs.table.selectAll(false);
      this.cleanSelectCount();
    },
    cleanSelectCount(){
      this.selectCount = 0;
    }
  },
  mounted() {
    // this.init();
  }
};
</script>
